<template>
	<view class="content">
		<view class="courses">
			<view class="topic" @tap="go_peixun">
				<text class="new">教务通知</text>
			</view>
			<view class="news" v-for="(item,index) of news" :key="index" @tap="go_news(index)">
				<text class="ntitle">{{item.title}}</text>
				<text class="time">{{item.time}}</text>
			</view>
			<view class="tips" @tap="more">{{tips}}</view>
		</view>
	</view>
</template>

<script>
	import utils from "../../static/js/utils.js"
	export default {
		data() {
			return {
				news: [],
				pageId: 0,
				tips: "加载更多"
			}
		},
		onLoad() {
			this.getNews(0, 0);
		},
		methods: {
			go_news(index) {
				let ne = this.news[index];
				uni.navigateTo({
					url: '../newsdetail/newsdetail?url=' + ne.url + "&time=" + ne.time
				});
			},
			more() {
				if (this.tips == '加载更多') {
					let pId = this.pageId;
					this.getNews(pId + 1, 1);
				}
			},
			getNews(pageId, type) {
				let that = this;
				utils.get("/news/list", {
					pageId: pageId
				}, function(data) {
					if (type == 0) {
						that.content = "加载更多";
						that.news = data;
					} else {
						if (data.length == 0) {
							that.content = "已经到底了"
						} else {
							that.news.push.apply(that.news, data);
							that.pageId++;
						}

					}
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		/* justify-content: center; */
		width: 100%;
		margin: 0px auto;
	}

	.courses {
		width: 100%;
		margin-top: 20upx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		background-color: #ffffff;
		align-items: center;
	}

	.topic {
		width: 93%;
		height: 90upx;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
	}

	.topic .new {
		flex: 1;
		font-size: 38upx;
		font-weight: 700;
	}

	.topic view {
		display: flex;
		flex-direction: row;
	}

	.topic view text {
		font-size: 30upx;
		color: #909399;
		margin-right: 7upx;
	}

	.topic view image {
		width: 40upx;
		height: 40upx;
	}

	.news {
		width: 93%;
		height: 180upx;
		box-shadow: inset 0px -1px 1px -1px #c8c7cc;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.ntitle {
		font-size: 30upx;
		margin-top: 18upx;
	}

	.time {
		font-size: 26upx;
		color: #666;
		margin-bottom: 18upx;
	}
	.tips {
		width: 100%;
		height: 90upx;
		font-size: 30upx;
		color: #666;
		line-height: 90upx;
		text-align: center;
	}
</style>
